<template>
  <div class="box">
    <h2>用户管理</h2>
    <template>
      <el-table :data="userList" border style="width: 100%">
        <el-table-column prop="id" label="ID" width="180"> </el-table-column>
        <el-table-column prop="username" label="姓名" width="180">
        </el-table-column>
        <el-table-column prop="email" label="邮箱"> </el-table-column>
        <el-table-column prop="phone" label="电话"> </el-table-column>
        <el-table-column prop="createTime" label="时间">
          <template slot-scope="scope">
            <p>{{ scope.row.createTime | dateFormat }}</p>
          </template>
        </el-table-column>
      </el-table>
      <paging
        :total="total"
      ></paging>
    </template>
  </div>
</template>

<script>
import { userList } from "../../../http/http";
import paging from "@/components/common/paging";
export default {
  name: "demo",
  props: [],
  components: {
    paging,
  },
  data() {
    return {
      queryInfo: {
        changeNum: 1,
        changeSize: 10,
      },
      userList: [],
      total: 0,
    };
  },
  mounted() {
    this.getUserList();
  },

  methods: {
    async getUserList() {
      const { data: res } = await userList(
        `/api/user/list.do?pageNum=${this.queryInfo.changeNum}&pageSize=${this.queryInfo.changeSize}`
      );
      if (res.status !== 0) return this.$message.error(res.msg);
      this.userList = res.data.list;
      this.total = res.data.total;
      this.$message.success("获取数据成功");
      // console.log(this.total);
    },

  },
};
</script>

<style>
.box {
  width: 80%;
  margin-left: 20%;
}
</style>
